<!--<!DOCTYPE html>-->
<!--<html lang="en">-->

<!--<head>-->
<!--  <meta charset="utf-8">-->

<!--  <title>验证码</title>-->
<!--  <style>-->
<!--    #inputCaptcha {-->
<!--      height: 30px;-->
<!--      vertical-align: middle; -->
<!--    }-->
<!--    #verificationCodeImg{-->
<!--      vertical-align: middle; -->
<!--    }-->
<!--    #checkCaptcha{-->
<!--      height: 40px;-->
<!--      width: 100px;-->
<!--    }-->
<!--  </style>-->
<!--</head>-->

<!--<body>-->
<!--  <h1>输入验证码</h1>-->
<!--  <div id="confirm">-->
<!--    <input type="text" name="inputCaptcha" id="inputCaptcha">-->
<!--    <img id="verificationCodeImg" src="/captcha/getCaptcha" style="cursor: pointer;" title="看不清？换一张" />-->
<!--    <input type="button" value="提交" id="checkCaptcha">-->
<!--  </div>-->
<!--  <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>-->
<!--  <script>-->
<!--    -->
<!--    $("#verificationCodeImg").click(function(){-->
<!--      $(this).hide().attr('src', '/captcha/getCaptcha?dt=' + new Date().getTime()).fadeIn();-->
<!--    });-->

<!--    $("#checkCaptcha").click(function () {-->
<!--        $.ajax({-->
<!--          type:"post",-->
<!--          url:"/captcha/check",-->
<!--          data:{-->
<!--            captcah:$("#inputCaptcha").val()-->
<!--          },-->
<!--          success:function(result){-->
<!--if(result){-->
<!--  location.href="success.html";-->
<!--}else {-->
<!--  alert("验证码错误，请重新输入");-->
<!--}-->
<!--          }-->
<!--        })-->
<!--    });-->

<!--  </script>-->
<!--</body>-->

<!--</html>-->

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
  <meta http-equiv="Pragma" content="no-cache" />
  <meta http-equiv="Expires" content="0" />

  <title>验证码</title>
  <style>
    #inputCaptcha {
      height: 30px;
      vertical-align: middle;
    }
    #verificationCodeImg{
      vertical-align: middle;
    }
    #checkCaptcha{
      height: 40px;
      width: 100px;
    }
  </style>
</head>

<body>
<h1>输入验证码</h1>
<div id="confirm">
  <input type="text" name="inputCaptcha" id="inputCaptcha">
  <img id="verificationCodeImg" src="/captcha/getCaptcha" style="cursor: pointer;" title="看不清？换一张" />
  <input type="button" value="提交" id="checkCaptcha">
</div>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>

  $("#verificationCodeImg").click(function(){
    $(this).hide().attr('src', '/captcha/getCaptcha?dt=' + new Date().getTime()).fadeIn();
  });

  $("#checkCaptcha").click(function () {
    $.ajax({
      type:"post",
      url:"/captcha/check",
      data:{
        captcha:$("#inputCaptcha").val()
      },
      success:function(result){
        if(result){
          location.href="success.html";
        }else{
          alert("验证码错误，请重新输入")
        }
      }
    })
  });

</script>
</body>
</html>